<template>
    <el-table :data="tableData" border highlight-current-row @selection-change="selectionChange">
        <el-table-column type="selection" align="center"></el-table-column>
        <el-table-column type="index" label="序号" width="70" align="center"></el-table-column>
        <el-table-column property="receiptNumber" label="单据号" show-overflow-tooltip align="center"></el-table-column>
        <el-table-column property="paymentSubjects" label="付款科目" show-overflow-tooltip align="center"></el-table-column>
        <el-table-column property="currencyName" label="币种名称" show-overflow-tooltip align="center"></el-table-column>
        <el-table-column property="oppositeAccounts" label="对方科目" show-overflow-tooltip align="center"></el-table-column>
        <el-table-column property="loanCategoryName" label="借款类别" show-overflow-tooltip align="center"></el-table-column>
        <el-table-column property="approvalAmount" label="借款金额" show-overflow-tooltip align="center"></el-table-column>
        <el-table-column property="expectedRepaymentDate" label="预计还款日期" width="120" show-overflow-tooltip align="center"></el-table-column>
        <el-table-column property="borrowingReason" label="借款事由" show-overflow-tooltip align="center"></el-table-column>
        <el-table-column property="state" label="状态" align="center">
            <template slot-scope="scope">
                <span v-if="scope.row.approvalStatus === 0" style="color: #f00;">未审核</span>
                <span v-if="scope.row.approvalStatus === 1" style="color: green;">已审核</span>
                <span v-if="scope.row.approvalStatus === 2" style="color: #f00;">审核未通过</span>
            </template>
        </el-table-column>
        <el-table-column label="操作" align="center" min-width="125">
            <template slot-scope="scope">
                <span class="primary-text" @click="update(scope.row.id)">修改</span>                                                          
                <span class="primary-text" @click="view(scope.row.id)">查看</span>                                                          
                <span class="primary-text" @click="approveHandler(scope.row.id)">审核</span>                                                          
                <span class="primary-text">撤单</span>                                                          
            </template>
        </el-table-column>
    </el-table>
</template>
<script>
export default {
    data() {
        return {
            
        }
    },
    computed: {
        tableData() {
            return this.$store.state.borrowOrderStore.tableData;
        }
    },
    methods: {
        selectionChange(arr) {
            this.$store.commit('borrowOrderStore/multipleSelection', arr);
        },
        update(id) {
            this.$store.commit('borrowOrderStore/updateRowId', id);     //更新审核单据的id
            this.$util.openLayerIframe({title: '借款单-修改', zIndex: 13, width: '85%', height: '85%', url: this.$domain + '/#/financial/borrowOrder/form'});
        },
        view(id) {            //查看单据
            this.$store.commit('borrowOrderStore/updateRowId', id);      //保存查看单据id
            this.$util.openLayerIframe({title: '借款单-查看', zIndex: 13, width: '85%', height: '85%', url: this.$domain + '/#/financial/borrowOrder/view'});
        },
        approveHandler(id) {      //审核单据
            this.$store.commit('borrowOrderStore/updateRowId', id);      //保存审核的单据id
            this.$util.openLayerIframe({title: '单据审核', width: '400px', height: '260px', url: this.$domain + '/#/financial/borrowOrder/approve'});
        }
    }
}
</script>